
<template>
  <baidu-map :center="markerPoint" :zoom="16" class="map">
    <bm-marker :position="markerPoint" :dragging="true" @click="infoWindowOpen"/>
  </baidu-map>
</template>

<script>
import user from '../../api/user'
export default {
  data() {
    return {
      markerPoint: {
        lng: '',
        lat: ''
      },
      show: false
    }
  },
  created() {
      this.get_coordinates()
  },
  methods: {
    infoWindowClose() {
      this.show = false
    },
    infoWindowOpen() {
      this.show = true
    },
    // TODO:判断是否有id
    get_coordinates() {
      console.log(this.$route.params.id)
      user.getCoordinates(this.$route.params.id).then(res => {
        this.markerPoint.lng = res.lng
        this.markerPoint.lat = res.lat
      })
    }
  }
}
</script>

<style lang="scss" scoped>
.map {
  width: 100%;
  height: 500px;
}
.more_panel {
  text-align: center;
  font-size: 12px;
  color: #2878ff;
  padding-top: 10px;
  span {
    cursor: pointer;
    i {
      transform: rotate(90deg);
    }
  }
  span.down {
    i {
      transform: rotate(-90deg);
    }
  }
}
</style>
